<template>
  <div class="pd30 produceFactory elevatorInstall">
    <div class="panelWrap">
      <div class="title flex flexac flexjcsb fs14 cfff fwb pl p-r-20">
        <div>电梯安装</div>
      </div>
      <div class="con">
        <div class="con-row flex flexac pl search-box">
          <div class="inputLable inputLable1 flex flexac none">
            <el-input v-model="queryParam.id" class="input" type="number" placeholder="请输入制造商ID" />
          </div>
          <div class="inputLable inputLable2 flex flexac">
            <el-input v-model="queryParam.name" class="input" placeholder="请输入制造商名称" />
          </div>
          <div class="groupbtn flex m-l-60 ">
            <div class="selectBtn flex flexac " @click="getsimpleViewList">查询</div>
            <el-button class="emptyBtn flexcenter m-l-25" type="info" @click="handleEmptySearch"><i class="iconfont icon-qingkong" />清空</el-button>
          </div>
        </div>

        <el-table
          id="factorytable"
          ref="factorytable"
          class="con-table"
          type="expand"
          :data="factorytable"
          style="width: 100%"
          highlight-current-row
        >
          <el-table-column width="90" type="selection" label="全选" />
          <template v-for="(item,index) in tablehead">
            <el-table-column v-if="item.isShow" :key="index" :sortable="item.sortable" :show-overflow-tooltip="true" :prop="item.prop" :label="item.label" />
          </template>
        </el-table>
        <el-pagination class="paginationWrap flex " :current-page="paging.currentPage" :page-sizes="paging.pageSizeArr" :page-size="paging.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="paging.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />

      </div>
    </div>

  </div>
</template>

<script>
// import { simpleViewList, simpleViewDelete } from '@/api/template/simpleView'
import { showNotice, formatDateTime } from '@/utils/toolclass'
import { tdEmpty } from '@/utils/textArr'
import coordinate from '@/components/coordinate'

export default {
  name: 'Unnamed',
  components: {
    coordinate
  },
  props: {},
  data() {
    return {
      paging: {
        currentPage: 1,
        pageSize: 100,
        pageSizeArr: [10, 20, 50, 100],
        total: 400
      },
      factorytable: [],
      queryParam: {
        id: '',
        name: ''
      },
      simpleViewDialog: false,
      factoryListInfo: [],
      editFactory: {},
      isEdit: false,
      selectDataLength: 0,
      refresh: false,
      seniorSet: {
        'field': false,
        'sortable': false
      },
      tablehead: [
        {
          index: 0,
          prop: 'id',
          label: '制造商ID',
          sortable: false,
          fixed: true,
          isShow: true
        },
        {
          index: 1,
          prop: 'name',
          label: '制造商名称',
          sortable: false,
          fixed: true,
          isShow: true
        },
        {
          index: 1,
          prop: 'contacts',
          label: '联系人',
          sortable: false,
          fixed: true,
          isShow: true
        },
        {
          index: 1,
          prop: 'phone',
          label: '联系人电话',
          sortable: false,
          fixed: true,
          isShow: true
        }

      ]

    }
  },
  computed: {},
  watch: {},
  created() {
    this.getsimpleViewList()
  },
  methods: {
    handleSenior(type) {
      if (type == 'field') {
        this.seniorSet.field = !this.seniorSet.field
        this.seniorSet.sortable = false
      }
      if (type == 'sortable') {
        this.seniorSet.field = false
        this.seniorSet.sortable = !this.seniorSet.sortable
      }
    },
    handleExportExcel() {
      require.ensure([], () => {
        const { export_json_to_excel } = require('@/excel/Export2Excel')
        const tHeader = ['制造商id', '制造商名称', '联系人', '联系人电话']
        const filterVal = ['id', 'name', 'contacts', 'phone']
        const data = this.formatJson(filterVal, this.factorytable)
        export_json_to_excel(tHeader, data, '制造商列表(' + formatDateTime().ymd) + ')'
      })
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]))
    },
    handleRefresh() {
      this.refresh = true
      this.getsimpleViewList()
      setTimeout(() => {
        this.refresh = false
      }, 1200)
    },
    getsimpleViewList() {
      simpleViewList(this.queryParam.id, this.queryParam.name, this.paging.currentPage, this.paging.pageSize).then((res) => {
        if (res.code === '000000') {
          this.factoryListInfo = res
          this.paging = {
            currentPage: res.pager.pageIndex,
            pageSize: res.pager.pageSize,
            total: res.pager.totalSize
          }
          this.factorytable = res.data
        }
      })
    },
    handleEmptySearch() {
      this.queryParam.id = ''
      this.queryParam.name = ''
      this.getsimpleViewList()
    },
    handleEdit(index, row) {
      this.simpleViewDialog = true
      this.isEdit = true
      this.editFactory = row
    },
    handleAdd() {
      this.simpleViewDialog = true
      this.isEdit = false
      this.editFactory = {
        address: '',
        contacts: '',
        id: '',
        name: '',
        nameSimple: '',
        phone: '',
        remark: '',
        version: 1
      }
    },
    handleDeleteBtn() {
      this.handleSelectVal()
      if (this.selectDataLength <= 0) {
        // this.$alert('还没有选中项', '提示', {
        //   confirmButtonText: '确定',
        //   callback: action => {
        //   }
        // })
        showNotice('error', '提示', '还没有选中项')
      } else if (this.selectDataLength.length > 1) {
        showNotice('error', '提示', '不允许多行删除')
      } else {
        this.$alert('这个操作会删除和它相关联的所有数据,确定要删除吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          showCancelButton: true,
          callback: action => {
            if (action == 'confirm') {
              this.handleDelete()
            }
          }
        })
      }
    },
    handleDelete() {
      const selectDataId = this.selectDataLength[0].id
      simpleViewDelete(selectDataId).then((res) => {
        if (res.code == '000000') {
          showNotice('success', '提示', '删除成功')
          this.getsimpleViewList()
        }
      })
    },
    handleSelectVal() {
      const _selectData = this.$refs.factorytable.selection
      this.selectDataLength = _selectData
    },
    handleCloseDialog() {
      this.simpleViewDialog = !this.simpleViewDialog
    },
    handleOneSelect(val) {
      console.log('选中某一行')
      console.log(val)
      this.handleSelectVal()
    },
    handleAllSelect(val) {
      console.log('全选')
      console.log(val)
      // this.$refs.factorytable.clearSelection();
    },
    handleAllSelectBtn() {
      console.log('全选操作')
      console.log(this.$refs.table)
      this.$refs.factorytable.toggleAllSelection()
    },
    handleEmptySelectBtn() {
      console.log('全选操作')
      console.log(this.$refs.table)
      this.$refs.factorytable.clearSelection()
    },
    handleSizeChange(val) {
      this.paging.pageSize = val
      this.getsimpleViewList()
    },
    handleCurrentChange(val) {
      this.paging.currentPage = val
      this.getsimpleViewList()
    }
  }
}
</script>
<style scoped lang="scss">
</style>
